<!-- #layout name=blank -->
<div class="page-header">
    <h1 class="title">Search</h1>
</div>
<div data-bind="component: { name: 'kb-breadcrumb', params:[{
    name: 'SITES'
},{
    name: 'DASHBOARD'
},{
    name: Kooboo.text.common.Search
}] }"></div>
<div class="row">
    <div class="col-md-3">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title"><span>Status</span> <i class="fa fa-question-circle" id="question-status" title="What's this?"></i></h3>
            </div>
            <div class="panel-body text-center" style="height: 66px">
                <input type="checkbox" id="sync-switch" data-bind="checked: enableSearch">
            </div>
        </div>
    </div>
    <div class="col-md-9">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">Index Data</h3>
            </div>
            <div class="panel-body">
                <div class="row">
                    <div class="item col-md-3 col-sm-6 col-xs-6">
                        <div class="number" data-bind="text: wordCount"></div>
                        <small class="text-muted">Word</small>
                    </div>
                    <div class="item col-md-3 col-sm-6 col-xs-6">
                        <div class="number" data-bind="text: docCount"></div>
                        <small class="text-muted">Document</small>
                    </div>
                    <div class="item col-md-3 col-sm-6 col-xs-6">
                        <div class="number" data-bind="text: diskSize"></div>
                        <small class="text-muted">Disk Size</small>
                    </div>
                    <div class="item col-md-3 col-sm-6 col-xs-6 text-center">
                        <button class="btn blue" data-bind="click: rebuild">Rebuild</button>
                        <button class="btn red" data-bind="click: clean">Clean</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-6">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">Lastest Search</h3>
            </div>
            <div class="panel-body row">
                <div data-bind="component: { name: 'kb-table', params: tableData }" style="margin-bottom: -30px;"></div>
            </div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">Search statistic</h3>
                <select class="pull-right" data-bind="options: weeks, value: week"></select>
            </div>
            <div class="panel-body row">
                <div id="chart" style="height: 500px;"></div>
            </div>
        </div>
    </div>
</div>

<script>
    (function() {
        Kooboo.loadJS([
            "/_Admin/Scripts/lib/bootstrap-switch/bootstrap-switch.min.js",
            "/_Admin/Scripts/components/kbBreadcrumb.js",
            "/_Admin/Scripts/lib/echarts.min.js",
            "/_Admin/Scripts/components/kbTable.js",
            "/_Admin/Scripts/tableModel.js"
        ])
        Kooboo.loadCSS([
            "/_Admin/Scripts/lib/bootstrap-switch/bootstrap-switch.min.css"
        ])
    })()
</script>
<script src="/_Admin/View/Development/Search.js"></script>